<!DOCTYPE html>
<html>
	<head>
		<title>Beautipedia - Options Page</title>
		<link rel="icon" type="image/png" href="images/icon_18x18.png">
		<link rel="stylesheet" href="styles/options.css">
	</head>
	<body onload="onload();">
		<div id="wrapper" class="drop-shadow lifted">
			<h1>Beautipedia - Preferences</h1>
			<form>
				<table class="contentblock">						
					<col width="5%" />
					<col width="95%" />
					<tr>
						<td><input type="checkbox" name="displayMlLinksDiv" id="displayMlLinksDiv"></td>
						<td>Display the "W" menu</td>
					</tr>
					<tr><td colspan="2">&nbsp;</td></tr>
					<tr>
						<td><input type="checkbox" name="colorLinks" id="colorLinks"></td>
						<td>Make links blue</td>
					</tr>
					<tr><td colspan="2">&nbsp;</td></tr>
					<tr>
						<td><input type="checkbox" name="textIndent" id="textIndent"></td>
						<td>Indent New Paragraphs</td>
					</tr>
					<tr><td colspan="2">&nbsp;</td></tr>
					<tr>
						<td><input type="checkbox" name="enableFLS" id="enableFLS"></td>
						<td>Enable Fast Language Switching</td>
					</tr>
					<tr>
						<td></td>
						<td>Other Language
							<select name="otherLang" id="otherLang">
								<option value="en">English</option>
								<option value="de">Deutsch</option>
								<option value="es">Espa&#x00F1;ol</option>
								<option value="eo">Esperanto</option>
								<option value="ar">&#x0627;&#x0644;&#x0639;&#x0631;&#x0628;&#x064A;&#x0629;</option>
								<option value="bg">&#x0411;&#x044A;&#x043B;&#x0433;&#x0430;&#x0440;&#x0441;&#x043A;&#x0438;</option>
								<option value="ca">Catal&#x00E0;</option>
								<option value="cs">&#x010C;esky</option>
								<option value="da">Dansk</option>
								<option value="fr">Fran&#x00E7;ais</option>
								<option value="ko">&#xD55C;&#xAD6D;&#xC5B4;</option>
								<option value="id">Bahasa Indonesia</option>
								<option value="it">Italiano</option>
								<option value="he">&#x05E2;&#x05D1;&#x05E8;&#x05D9;&#x05EA;</option>
								<option value="lt">Lietuvi&#x0173;</option>
								<option value="hu">Magyar</option>
								<option value="nl">Nederlands</option>
								<option value="ja">&#x65E5;&#x672C;&#x8A9E;</option>
								<option value="nb">Norsk (bokm&#x00E5;l)</option>
								<option value="pl">Polski</option>
								<option value="pt">Portugu&#x00EA;s</option>
								<option value="ru">&#x0420;&#x0443;&#x0441;&#x0441;&#x043A;&#x0438;&#x0439;</option>
								<option value="ro">Rom&#x00E2;n&#x0103;</option>
								<option value="sk">Sloven&#x010D;ina</option>
								<option value="sr">&#x0421;&#x0440;&#x043F;&#x0441;&#x043A;&#x0438; / Srpski</option>
								<option value="fi">Suomi</option>
								<option value="sv">Svenska</option>
								<option value="tr">T&#x00FC;rk&#x00E7;e</option>
								<option value="uk">&#x0423;&#x043A;&#x0440;&#x0430;&#x0457;&#x043D;&#x0441;&#x044C;&#x043A;&#x0430;</option>
								<option value="vi">Ti&#x1EBF;ng Vi&#x1EC7;t</option>
								<option value="vo">Volap&#x00FC;k</option>
								<option value="zh">&#x4E2D;&#x6587;</option>   
							</select>
						</td>
					</tr>
				</table>
			</form>
		</div>

		<script>

			var displayMlLinksDiv = document.getElementById('displayMlLinksDiv');
			var colorLinks = document.getElementById('colorLinks');
			var textIndent = document.getElementById('textIndent');
			var enableFLS = document.getElementById('enableFLS');
			var otherLang = document.getElementById('otherLang');			

			displayMlLinksDiv.addEventListener('change', function() {
				widget.preferences.displayMlLinksDiv = this.checked?1:0;
			}, false );

			colorLinks.addEventListener('change', function() {
				widget.preferences.colorLinks = this.checked?1:0;
			}, false );

			textIndent.addEventListener('change', function() {
				widget.preferences.textIndent = this.checked?1:0;
			}, false );

			enableFLS.addEventListener('change', function() {
				widget.preferences.enableFLS = this.checked?1:0;
				otherLang.disabled = !this.checked;
				if (this.checked) {
					alert("Beautipedia has only been tested in English. It may not look correct in certain languages. Some languages may not even have a counterpart for the English article.");
				}
			}, false );
			
			otherLang.addEventListener('change', function() {
				widget.preferences.otherLang = this.value;
			}, false );

			displayMlLinksDiv.checked = (widget.preferences.displayMlLinksDiv==1);
			colorLinks.checked = (widget.preferences.colorLinks==1);
			textIndent.checked = (widget.preferences.textIndent==1);
			enableFLS.checked = (widget.preferences.enableFLS==1);
			otherLang.value = widget.preferences.otherLang;
			
		</script>
	</body>
</html>